<div class="compassClockContainer">
    <div class="compassClockMain">
        <div class="year">{{date.year + date.month + date.day}}</div>
        <div class="hour" [ngStyle]="{'transform':'rotate('+ hourRotate +'deg)'}">
            <span *ngFor="let item of hours" [ngStyle]="{'transform':'rotate('+ item.rotate +'deg)'}">
                <a>{{item.label}}</a>
            </span>
        </div>
        <div class="minute" [ngStyle]="{'transform':'rotate('+ minuteRotate +'deg)'}">
            <span *ngFor="let item of minutes" [ngStyle]="{'transform':'rotate('+ item.rotate +'deg)'}">
                <a>{{item.label}}</a>
            </span>
        </div>
        <div class="second" [ngStyle]="{'transform':'rotate('+ secondRotate +'deg)'}">
            <span *ngFor="let item of seconds" [ngStyle]="{'transform':'rotate('+ item.rotate +'deg)'}">
                <a>{{item.label}}</a>
            </span>
        </div>
        <div class="pointer"></div>
    </div>
</div>
